//globel variabe for all jb menue per page
var jbMenus= new Array();

jbMenus.itemCount = 0;
jbMenus.timeout = 3000;

jbMenus.menuClass = "jbMenuDiv";
jbMenus.itemClass = "jbMenuItem";
jbMenus.itemClassOver = "jbMenuItemOver";
jbMenus.hrClass = "jbMenuHr";
jbMenus.imgSrc = "jslib/arrow.gif";
jbMenus.imgSrcOver = "jslib/arrow_o.gif";
jbMenus.menuTimeOutId=null;

/**
* Member function of JBMenu
* add a menu item to jbMenu.
**/

function MenuItem() 
{
  this.id = "Item" + (++jbMenus.itemCount);
  this.displayText = arguments[0];
  this.itemName = "";
  this.target = "";
  
  this.myMenu = null;
  this.enabled = true;
  if (this.displayText == "-") {
    this.className = jbMenus.hrClass;
  }
  else {
    this.className = jbMenus.itemClass;
  }
  
  this.hrClass = jbMenus.hrClass;
  this.classNameOver = jbMenus.itemClassOver;
  var length = arguments.length;
  if (length > 1) {
    if (arguments[1].length > 0) {
      this.itemName = arguments[1];
    }
  }
  if (length > 2) {
    if (arguments[2].length > 0) {
      this.target = arguments[2];
    }
  } 
  if (length > 3) {
    if (typeof(arguments[3]) == "boolean") {
      this.enabled = arguments[3];
    }
  }

  if (length > 4) {
    if (arguments[4].length > 0) {
      if (arguments[4] == "-") {
        this.className = arguments[4];
        this.hrClass = arguments[4];
      }
      else {
        this.normalStyle = arguments[4];
      }
    }
  }
  if (length > 5) {
    if (arguments[5].length > 0) {
      this.hoverStyle = arguments[5];
    }
  }
  if (length > 6) {
    if (arguments[6].length > 0) {
      this.componentId = arguments[6];
    }
  }
  if (length > 7) {
    if (arguments[7].length > 0) {
      this.page = arguments[7];
    }
  }
  if (length > 8) {
    if (arguments[8].length > 0) {
      this.iconImage = arguments[8];
    }
  }
}

//Construct the top menu.
function JBMenu() 
{
  jbMenus[jbMenus.length] = this; //add this menu to pagelevel cache
  this.id = arguments[0] ;
  this.isDesign=true;
  this.level = 300; //must be high enough not to be covered
  this.items = new Array();
  this.subItems = new Array();
  this.previousItem = null;
  this.menuClass = jbMenus.menuClass;
  this.parent = null;
  this.rootMenu = true;
  this.visible = false;
  if (arguments.length > 2) 
  {
    if (arguments[2].length > 0) {
      this.menuClass = arguments[2];
    }
  }
  
  var divElm = document.createElement("div");
  this.innerView = document.createElement("div");
  divElm.appendChild(this.innerView);
  this.view = divElm;
  
  divElm.id = this.id;
  divElm.level = this.level;
  divElm.className = this.menuClass;
  //return page
  if (arguments.length > 3) {
    if (arguments[3].length > 0) {
      this.backPanel = arguments[3];
      divElm.backPanel = this.backPanel;
    }
  }
  //css
  if (arguments.length > 4) {
    if (arguments[4].length > 0) {
      divElm.style.cssText = arguments[4];
    }
  }
  if (arguments.length > 5) {
    this.isDesign = arguments[5];
  }
  
  divElm.componentId = this.id;
  
  divElm.ondrop = function() 
    {
      if(event)
        event.cancelBubble=true;
    };    

    width = parseInt(arguments[1]) + "px";
    divElm.style.left = "0px";
    divElm.style.top = "0px";

    document.body.appendChild(divElm);

  //this.menuBox = divElm;
  this.hide = function()
  { 
    this.view.style.display='none';
    this.visible=false;
  //  JBRectTool.hideShadow();
  }
  
  this.show = function()
  {
   // Effect.SlideDown(this.view,{duration:0.3});
    this.view.style.display='block';
    this.visible = true;
    //JBRectTool.shadowDiv(this.view);
  }

  this.addMenuItem = function (mi) 
    {
      mi.myMenu=this;
      //reander separator
      if (mi.displayText == "-") 
      {
        var spanElm = document.createElement("div");

        spanElm.innerHTML= 
            '<div class="'+jbMenus.hrClass+'" >' 
            + '<img width="98%" height="2px" src="resources/images/bg/divider.GIF" />'+
            '</div>';

        this.innerView.appendChild(spanElm);
        this.subItems[this.subItems.length] = mi;
        mi.view = spanElm;
        spanElm.onmouseover = jbMenus.clearMenuTimer;
      }
      else 
      {
        divElm = document.createElement("div");
        this.innerView.appendChild(divElm);    
        divElm.menuItem = mi;

        divElm.id = mi.id;
        divElm.target = mi.target;
        divElm.enabled = mi.enabled;
        divElm.itemClass = mi.className;
    
        divElm.hasSubMenu = false;
        divElm.subMenu = null;
        
        divElm.imgSrc = jbMenus.imgSrc;
        divElm.imgSrcOver = jbMenus.imgSrcOver;
        
        divElm.normalStyle= mi.normalStyle;
        divElm.hoverStyle=mi.hoverStyle;
    
        divElm.displayText = mi.displayText;
        
        divElm.iconImage = mi.iconImage;
        
        divElm.style.cssText=divElm.normalStyle;
        divElm.className = divElm.itemClass;
        
        if(divElm.iconImage)
          divElm.innerHTML = '<table cellspacing="0" border="0" cellpadding="0"><tr><td id="'
            + divElm.id+'icon" class="jbMenuItemLead" >'
            +'<img width="16px" height="16px" src="' + divElm.iconImage+'" />'
            +'</td><td valign="middle" width="100%" class="jbMenuItemText"  id="'+divElm.id+'row">' 
            + divElm.displayText+'</td><td valign="middle" class="jbMenuItemTrail" id="'
            + divElm.id+'arrow"></td></tr></table>';
        else 
          divElm.innerHTML = '<table cellspacing="0" border="0" cellpadding="0"><tr><td id="'
          +divElm.id+'icon" class="jbMenuItemLead" >'
          +'<img width="16px" height="16px" src="resources/images/empty.gif" /></td>'
          +'<td class="jbMenuItemText" valign="middle" width="100%" id="'
          +divElm.id+'row">'+mi.displayText+'</td><td class="jbMenuItemTrail" valign="middle" id="'
          +divElm.id+'arrow"></td></tr></table>';
        
        divElm.rowText=$(divElm.id + "row");
        divElm.rowIcon=$(divElm.id + "icon");
        divElm.rowArraw=$(divElm.id + "arrow");
        
        divElm.parent = this;
        divElm.setAttribute("designable", 'true');
          
        divElm.setSubMenu = function (jbMenu) 
          {
            var imgElm = document.createElement("img");
            imgElm.src = this.imgSrc;
            imgElm.id = this.id + "Arrow";
            
            divElm = document.createElement("div");
            divElm.appendChild(imgElm);
            this.rowArraw.appendChild(divElm);
            this.hasSubMenu = true;
            this.subMenu = jbMenu;
            this.subMenuItem = divElm;
            this.arrowItem = imgElm
            this.setImgSrc = function (imgSrc) 
              {
                if (this.arrowItem) {
                  this.imgSrc = imgSrc;
                  this.arrowItem.src = this.imgSrc
                }
              };
            jbMenu.rootMenu = false;
            jbMenu.view.style.zIndex = this.parent.level + 1;
            jbMenu.level = this.parent.level + 1;
            jbMenu.view.level = jbMenu.level;
            jbMenu.parent = this;
          }
    
        divElm.onmousedown =function (e)
          {
             if (this.enabled && this.target) {
              if(this.parent.isDesign)
              {
                if(this.menuItem.displayText=='add new item')
                {
                  var loc = this.target +'?itemType='
                    +"com.jb.web.bean.MenuItem"
                    +'&id='+this.menuItem.componentId;
                  JB._e(loc, this.menuItem.componentId, "com.jb.web.application.event.ComponentEH.onAddComponent");
                }else
                { 
                    if(jbDesigner)
                        jbDesigner.select(e, this.menuItem.page+'.xsp', this.menuItem.componentId, this.menuItem.componentId, true);
                }
              }else
              {
                location.href = this.target;
              }
            }
          }
        
        divElm.cursor="hand";
        divElm.onmouseover = function (e) 
          {
            jbMenus.clearMenuTimer();
            if (this.parent.previousItem) 
            {
              var lastElm = this.parent.previousItem;
              lastElm.style.cssText = lastElm.normalStyle; 
              lastElm.rowText.style.color = lastElm.style.color;
              lastElm.rowIcon.style.cssText = lastElm.normalStyle; 
              if (lastElm.hasSubMenu) 
              {
                lastElm.className = lastElm.itemClass;
                if (lastElm.arrowItem) 
                {
                  lastElm.arrowItem.src = lastElm.imgSrc;
                }
              }
              
              for (i = 0; i < jbMenus.length; i++) 
              {
                var jbMenu = jbMenus[i];
                if (jbMenu.level > this.parent.level) 
                {
                  if(this.parent.previousItem!=this)
                    jbMenu.hide();          
                }      
              }
            }
            
            if (this.enabled) 
            {
              this.style.cssText = this.hoverStyle;
              this.rowText.style.color = this.style.color;
              this.rowIcon.style.cssText = this.hoverStyle;
              if (this.hasSubMenu) 
              {
                if (this.arrowItem) 
                {
                  this.arrowItem.src = this.imgSrcOver;
                }
                if(!this.subMenu.visible)
                {
                  this.subMenu.setSubMenuPos(this.parent.view, this);
                          
                }
              }
            }
            this.parent.previousItem = this;
          };
        
        divElm.onmouseout = function (e) 
          {
            if (this.enabled) 
            {    
              if (!((this.hasSubMenu) && (this.subMenu.view.style.display == "block"))) {
                this.className = this.itemClass;
              }
            
              if (this.hasSubMenu) 
              {
            
                var imgElm = this.arrowItem;
                if (this.subMenu.view.style.display == "block") {
                  imgElm.src = this.imgSrcOver;
                }
                else {
                  imgElm.src = this.imgSrc;
                }
              }
            }
            jbMenus.menuTimeOutId = window.setTimeout('jbMenus.hideAll();', jbMenus.timeout);
          };
        
        divElm.itemName = mi.itemName;
        this.items[mi.itemName] = divElm;
        this.subItems[this.subItems.length] = mi;
        mi.view = divElm;
      }
    };
    
  this.setSubMenuPos=function(parent, menuItem) {
    this.view.style.left = (parent.offsetLeft + parent.offsetWidth - JavaBase.Dimension.getScrollLeft()- 3) + "px";
    this.view.style.top = (parent.offsetTop + menuItem.offsetTop) + "px";
    this.show(); 
  };

  this.setTopMenuPos = function (e, pMode) 
    {
      jbMenus.hideInternal();
   
      if(pMode=='popup')
      { 
        var evtPos= getEventLoc(e);
        this.view.style.left = (evtPos.left 
          + JavaBase.Dimension.getScrollLeft()) + "px";
        this.view.style.top = ( evtPos.top
          + JavaBase.Dimension.getScrollTop()) + "px";
      }else
      {    
        if (e.srcElement) 
        {
          pt = JavaBase.Dimension.getElementPosition(e.srcElement);
          var x = pt.left + (pMode=='sidemenu'?e.srcElement.offsetWidth:0);
          var y = pt.top  + (pMode=='dropdown'?e.srcElement.offsetHeight:0);
        }
        
        if (e.target) 
        {
          pt = JavaBase.Dimension.getElementPosition(e.target);
          x = pt.left + (pMode=='sidemenu'?e.target.offsetWidth:0);
          y = pt.top  + (pMode=='dropdown'?e.target.offsetHeight:0);
        }
      
        this.view.style.left = ( x + JavaBase.Dimension.getScrollLeft()) + "px";
        this.view.style.top = ( y + JavaBase.Dimension.getScrollTop()) + "px";
      }
      
      this.show();
    }
    
  this.reset=function ()
    {
      //set all menuitem to not highlighted
      for(var i=0; i<this.subItems.length;i++)
      {
        divElm = this.subItems[i].view;
        divElm.style.cssText =divElm.normalStyle;

        divElm.className = divElm.itemClass;
        if(divElm.arrowItem)
          divElm.arrowItem.src = divElm.imgSrc;        
        if(divElm.rowText)
          divElm.rowText.style.color = divElm.style.color;
        if(divElm.rowIcon)
          divElm.rowIcon.style.cssText = divElm.normalStyle; 

      }
    };
}


//sytle for windows menu
WinMenuStyleClass = Class.create();

WinMenuStyleClass.prototype = {
  initialize : function(designTime) {
    this.designTime=designTime;
    this.bMsShow=designTime;//!_designTime;  
    this.msWinMenuSelectedElement=null;
  },

  hide : function ()
  {
    this.bMsShow= this.designTime;//!_designTime;
    if(this.msWinMenuSelectedElement)
    {
        this.msWinMenuSelectedElement.style.backgroundColor='';
        this.msWinMenuSelectedElement.style.color='';
    }  
  },
  
  menuMouseOver : function (e,elm,elmId,pMode)
  {
       // 
    jbMenus.clearMenuTimer();//defined in jbmenie
    if(this.msWinMenuSelectedElement)
    {
        this.msWinMenuSelectedElement.style.backgroundColor='';
        this.msWinMenuSelectedElement.style.color='';
    }
    
    this.msWinMenuSelectedElement = elm;

    elm.style.backgroundColor='highlight';
    elm.style.color='white';

    if(this.bMsShow)
    {
       
      for (i = 0; i < jbMenus.length; i++)
      {
        var menuItem = jbMenus[i];
        if (menuItem.view.id==elmId) 
        {
          menuItem.setTopMenuPos(e, pMode);
          break;
        }
      }
    }
  },
  
  menuMouseOut : function(elm)
  {
    return false;
  },

  menuMouseDown : function (e,elm,elmId,pMode)
  {
    this.bMsShow=true;
    this.menuMouseOver(e,elm,elmId,pMode);
    Event.stop(e);
    return false;
  }
}

designMenuStyle = new WinMenuStyleClass(true);
winMenuStyle = new WinMenuStyleClass(false);

//hide current open menu, all of them
jbMenus.hideInternal=function()
{
  for (var i = 0; i < this.length; i++) 
  {
    this[i].hide();
    if(this[i].reset)
      this[i].reset();
  }
  this.clearMenuTimer();
}


jbMenus.clearMenuTimer=function()
{
  if(this.menuTimeOutId!=null)
  {
    window.clearTimeout(this.menuTimeOutId);
    this.menuTimeOutId=null;
  }
}

//hide all the menu item
jbMenus.hideAll=function(e)
{
  winMenuStyle.hide();
  jbMenus.hideInternal();
}

jbMenus.hideAllOnClick=function(e)
{
  src = JavaBase.EventFactory.getEventSource(e);
  if(src.tagName=='IMG')
    return;
  jbMenus.hideAll(e);
}
//mouse handler to display meue
function showJBMenu(e, menuId, pMode) 
{
  if (javaBaseBrowser.ie) 
  {
    return;
  }
  
  if (e.target) 
  {
    return;
  }

  //get Top Menu visibility
  for (i = 0; i < jbMenus.length; i++)
  {
    var menuItem = jbMenus[i];
      //hide visible one
    if (menuItem.view.id==menuId) 
    {
      menuItem.setTopMenuPos(e, pMode);
      break;
    }
  }
  return false;
}

Element.observe(document, 'mousedown', function(event){
   jbMenus.hideAllOnClick(event);
 });
 
//JavaBase.EventFactory.registerMousedownListener(document, jbMenus.hideAllOnClick);
JavaBase.EventFactory.registerWindowResizeListener( jbMenus.hideAll);
